import React from 'react'
import {Button, Form, Input} from 'antd'
import * as server from '../../api/request'

/**
 * @template 登录页
 * @author 江南小魏晨
 */
const Login: React.FC = (props: any) => {

    const layout = {
        labelCol: { span: 4 },
        wrapperCol: { span: 20 }
    }
    const tailLayout = {
        wrapperCol: { offset: 4, span: 20 }
    }
    function onFinish (values: any) {
        server.login({
            userName: values.userName,
            userPassword: values.password
        }).then((res: any) => {
            console.log(res)
        })
    }
    function singIn () {
        props.history.push('/signIn')
    }
    return (
        <Form {...layout} name="login" initialValues={{ remember: true }} onFinish={onFinish}>
            <Form.Item
                label="userName"
                name="userName"
                rules={[{ required: true, message: 'Please input your username!' }]}
            >
                <Input />
            </Form.Item>
            <Form.Item
                label="password"
                name="password"
                rules={[{ required: true, message: 'Please input your password!' }]}
            >
                <Input.Password />
            </Form.Item>
            <Form.Item {...tailLayout}>
                <Button htmlType="submit">登录</Button>
                <Button htmlType="button" onClick={singIn}>注册</Button>
            </Form.Item>
        </Form>
    )
}
export default Login